<#include "base.ftl">
<!DOCTYPE html>
<html>
  
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>广州久龙精品酒店</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="${base}css/sm.min.css">
    <link rel="stylesheet" href="${base}css/sm-extend.min.css">
    <link rel="stylesheet" type="text/css" href="${base}css/iconfont.css">
    <link rel="stylesheet" type="text/css" href="${base}css/main.css">
  </head>
  
  <body>
    <div class="page-group">
      <!--弹出层start-->
      <div class="popup popup-sheshi">
        <header class="bar bar-nav">
          <a class="button button-link button-nav pull-right close-popup">关闭</a>
          <h1 class="title">请选择您需要的设施服务</h1>
        </header>
        <div class="content native-scroll">
          <div class="content-inner">
            <div class="content-block">
              <div class="list-block">
                <ul>
                  <li>
                    <label class="label-checkbox item-content">
                      <input class="sheshi" type="checkbox" name="breakfirst" value="早餐">
                      <div class="item-media">
                        <i class="icon icon-form-checkbox"></i>
                      </div>
                      <div class="item-inner">早餐</div>
                    </label>
                  </li>
                  <li>
                    <label class="label-checkbox item-content">
                      <input class="sheshi" type="checkbox" name="park" value="停车场">
                      <div class="item-media">
                        <i class="icon icon-form-checkbox"></i>
                      </div>
                      <div class="item-inner">停车场</div>
                    </label>
                  </li>
                  <li>
                    <label class="label-checkbox item-content">
                      <input class="sheshi" type="checkbox" name="meettingRoom" value="会议室">
                      <div class="item-media">
                        <i class="icon icon-form-checkbox"></i>
                      </div>
                      <div class="item-inner">会议室</div>
                    </label>
                  </li>
                  <li>
                    <label class="label-checkbox item-content">
                      <input class="sheshi" type="checkbox" name="wifi" value="客房wifi">
                      <div class="item-media">
                        <i class="icon icon-form-checkbox"></i>
                      </div>
                      <div class="item-inner">客房wifi</div>
                    </label>
                  </li>
                  <li>
                    <label class="label-checkbox item-content">
                      <input class="sheshi" type="checkbox" name="visitor" value="接待外宾">
                      <div class="item-media">
                        <i class="icon icon-form-checkbox"></i>
                      </div>
                      <div class="item-inner">接待外宾</div>
                    </label>
                  </li>
                </ul>
              </div>
              <p><a id="sheshiok" class="button close-popup">确定</a></p>
            </div>
          </div>
        </div>
      </div>
      <!--弹出层end-->
      <!--弹出层start-->
      <div class="popup popup-cuxiao">
        <header class="bar bar-nav">
          <a class="button button-link button-nav pull-right close-popup">关闭</a>
          <h1 class="title">请选择您需要的促销活动</h1>
        </header>
        <div class="content native-scroll">
          <div class="content-inner">
            <div class="content-block">
          
              <p><a id="cuxiaook" class="button close-popup">确定</a></p>
            </div>
          </div>
        </div>
      </div>
      <!--弹出层end-->
      <!--侧边栏start-->
      <div class="panel-overlay"></div>
      <div class="panel panel-left panel-reveal theme-dark" id='panel-left-demo'>
        <div class="content-block">
          <!--搜索start-->
          <div class="searchbar">
            <div class="search-input">
              <label class="icon icon-search" for="search"></label>
              <input type="search" name='search' placeholder='输入关键字...' />
            </div>
          </div>
          <!--搜索end-->
          <p>
            <h3>广州久龙精品酒店</h3></p>
          <div class="list-block">
            <ul>
              <li>
                <div class="item-content">
                  <div class="item-inner item-content item-link">
                    <a href="${base}index.html" external>首页</a>
                  </div>
                </div>
              </li>
              <li>
                <div class="item-content">
                  <div class="item-inner item-content item-link">
                    <a href="${base}kfyd1.html" external>客房预订</a>
                  </div>
                </div>
              </li>
              <li>
                <div class="item-content">
                  <div class="item-inner item-content item-link">
                    <a href="${base}yhhd.html" external>优惠活动</a>
                  </div>
                </div>
              </li>
              <li>
                <div class="item-content">
                  <div class="item-inner item-content item-link">
                    <a href="${base}jdsp.html" external>酒店视频</a>
                  </div>
                </div>
              </li>
              <li>
                <div class="item-content">
                  <div class="item-inner item-content item-link">
                    <a href="${base}jdjm.html" external>酒店加盟</a>
                  </div>
                </div>
              </li>
              <li>
                <div class="item-content">
                  <div class="item-inner item-content item-link">
                    <a href="${base}jdjs.html" external>酒店相关</a>
                  </div>
                </div>
              </li>
            </ul>
          </div>
          <p><a href="${base}#" class="close-panel button button-big button-fill button-danger">关闭</a></p>
        </div>
      </div>
      <!--侧边栏end-->
      <div class="page page-current">
        <!--顶栏start-->
        <header class="bar bar-nav">
          <a class="icon icon-menu button button-link button-nav pull-left open-panel" href="javascript:;" data-panel='#panel-left-demo'></a>
          <h1 class="title">
            <img src="${base}img/logo.jpg">广州久龙精品酒店
          </h1>
        </header>
        <!--顶栏end-->
        <!--底栏start-->
        <nav class="bar bar-tab">
          <a class="tab-item active create-actions" href="#">
            <span class="icon icon-phone"></span>
            <span class="tab-label">电话咨询</span>
          </a>
        </nav>
        <!--底栏end-->
        <div class="content native-scroll">
          <!--轮播start-->
          <div class="swiper-container swiper-container-horizontal" data-space-between="10">
            <div class="swiper-wrapper">
              <div class="swiper-slide swiper-slide-prev">
                <img src="${base}img/banner/banner1.jpg" alt="">
              </div>
              <div class="swiper-slide swiper-slide-active">
                <img src="${base}img/banner/banner2.jpg" alt="">
              </div>
              <div class="swiper-slide swiper-slide-next">
                <img src="${base}img/banner/banner3.jpg" alt="">
              </div>
            </div>
            <div class="swiper-pagination">
              <span class="swiper-pagination-bullet swiper-pagination-bullet-active"></span>
              <span class="swiper-pagination-bullet"></span>
              <span class="swiper-pagination-bullet"></span>
            </div>
          </div>
          <!--轮播end-->
          <!--导航start-->
          <div class="buttons-tab">
            <a href="${base}index.html" class="button smallnav" external>首页</a>
            <a href="${base}kfyd1.html" class="button smallnav active" external>客房预订</a>
            <a href="${base}yhhd.html" class="button smallnav" external>优惠活动</a>
            <a href="${base}jdsp.html" class="button smallnav" external>酒店视频</a>
            <a href="${base}jdj.html" class="button smallnav" external>酒店相关</a>
            <a href="${base}jdjm.html" class="button smallnav" external>酒店加盟</a>
          </div>
          <!--导航end-->
          <div class="page-index">
            <!--搜索start-->
            <div class="content-padded grid-demo">
              <div class="search">
                <input type="text" name="search" class="searchtext">
                <input type="submit" class="searchsub" value="">
              </div>
            </div>
            <!--搜索end-->
            <!--筛选块start-->
            <div class="list-block inset">
              <form method="post" action="">
                <ul>
                 
                   <li class="item-content item-link">
                      <div class="item-media">
                        <i class="iconfont icon-ditu icon-active"></i>
                      </div>
                      <div class="item-inner">
                        <div class="item-title label">我的位置</div>
                        <div class="item-input">
                          <input type="text" name="city" id="city" placeholder="请选择您的位置">
                        </div>
                      </div>
                    </li>
             <li class="item-content item-link">
                    <div class="item-media">
                      <i class="iconfont icon-dujia icon-active"></i>
                    </div>
                    <div class="item-inner">
                      <div class="item-title label">设施服务</div>
                      <div class="item-input">
                        <input type="text" id="sheshifuwu" class="open-popup" data-popup=".popup-sheshi" placeholder="请选择您需要的服务" name="publicDada">
                      </div>
                    </div>
                  </li>       
                  <li class="item-content item-link">
                    <div class="item-media">
                      <i class="iconfont icon-rili icon-active"></i>
                    </div>
                    <div class="item-inner">
                      <div class="item-title label">入住日期</div>
                      <div class="item-input">
                        <input type="text" placeholder="请选择日期" data-toggle='date' readonly="">
                      </div>
                    </div>
                  </li>
                  <li class="item-content item-link">
                    <div class="item-media">
                      <i class="iconfont icon-lishihangcheng icon-active"></i>
                    </div>
                    <div class="item-inner">
                      <div class="item-title label">离店日期</div>
                      <div class="item-input">
                        <input type="text" placeholder="请选择日期" data-toggle='date' readonly="">
                      </div>
                    </div>
                  </li>
                </ul>
              
               <!--选项卡1end-->
              <!--选项卡2start-->
              <div id="hour-room" class="qt-hide">
                <div class="list-block inset marginnone">
                  <ul>
                    <li class="item-content item-link">
                      <div class="item-media">
                        <i class="iconfont icon-ditu icon-active"></i>
                      </div>
                      <div class="item-inner">
                        <div class="item-title label">我的位置</div>
                        <div class="item-input">
                          <input type="text" id="city1" placeholder="请选择您的位置">
                        </div>
                      </div>
                    </li>
                    <li class="item-content item-link">
                      <div class="item-media">
                        <i class="iconfont icon-rili icon-active"></i>
                      </div>
                      <div class="item-inner">
                        <div class="item-title label">入住日期</div>
                        <div class="item-input">
                          <input type="text" placeholder="请选择日期" data-toggle='date' readonly="">
                        </div>
                      </div>
                    </li>
                  </ul>
                </div>
              </div>
              <!--选项卡2end-->
                <div class="sub">
                  <input type="submit" class="button button-big button-fill button-success" value="搜索">
                </div>
              </form>
            </div>
            <!--筛选块end-->
          <#if (detailList?size>0) && (detailList)>
            <!--排序start-->
            <div class="buttons-tab">
              <a href="#" class="button smallnav active" external>推荐</a>
     
     
              <a href="${base}selectOrder" class="button smallnav" external>
                我的订单
              </a>
            </div>
            
            <!--排序end-->
 <!--卡片start-->
 			<#list detailList as product>
            <div class="card facebook-card">
              <div class="card-header no-border">
                <div class="facebook-avatar">
                  <img src="${base}img/logo.jpg" width="34" height="34">
                </div>
                <div class="facebook-name">久龙精品酒店</div>
                <div class="facebook-date">${product.name}</div>
              </div>
              <div class="card-content">
                <img src="http://threeshop1.oss-cn-hangzhou.aliyuncs.com${product.picture}" width="100%">
                <div class="card-content-inner">
                  <div class="list-block">
                    <ul>
                    <#list product.prodList as title>
                    <#if title.title=="1">
                    <a href="${base}ddzf2?productId=${title.id}">
                      <li class="item-content item-link">
                        <div class="item-media"><i class="icon icon-f7"></i></div>
                        <div class="item-inner">
                          <div class="item-title">标准单人间</div>
                          <div class="item-after price">&yen;${title.nowprice}</div>
                        </div>
                      </li>
                    </a>  
                      <#elseif title.title==2>
                      <a href="${base}ddzf2?productId=${title.id}">
                       <li class="item-content item-link">
                        <div class="item-media"><i class="icon icon-f7"></i></div>
                        <div class="item-inner">
                          <div class="item-title">标准双人间</div>
                          <div class="item-after price">&yen;${title.nowprice}</div>
                        </div>
                      </li>
                      </a>
                      <#elseif title.title==3>
                      <a href="${base}ddzf2?productId=${title.id}">
    				<li class="item-content item-link">
                        <div class="item-media"><i class="icon icon-f7"></i></div>
                        <div class="item-inner">
                          <div class="item-title">标准三人间</div>
                          <div class="item-after price">&yen;${title.nowprice}</div>
                        </div>
                      </li>
                      </a>
                      <#elseif title.title==4>
                      <a href="${base}ddzf2?productId=${title.id}">
    				<li class="item-content item-link">
                        <div class="item-media"><i class="icon icon-f7"></i></div>
                        <div class="item-inner">
                          <div class="item-title">电脑单人房</div>
                          <div class="item-after price">&yen;${title.nowprice}</div>
                        </div>
                      </li>
                      </a>
                      <#elseif title.title==5>
                      <a href="${base}ddzf2?productId=${title.id}">
    				<li class="item-content item-link">
                        <div class="item-media"><i class="icon icon-f7"></i></div>
                        <div class="item-inner">
                          <div class="item-title">电脑双人房</div>
                          <div class="item-after price">&yen;${title.nowprice}</div>
                        </div>
                      </li>
                      </a>
                       <#elseif title.title==6>
                      <a href="${base}ddzf2?productId=${title.id}">
    				<li class="item-content item-link">
                        <div class="item-media"><i class="icon icon-f7"></i></div>
                        <div class="item-inner">
                          <div class="item-title">麻将娱乐房</div>
                          <div class="item-after price">&yen;${title.nowprice}</div>
                        </div>
                      </li>
                      </a>
                      </#if>
                      </#list>
                    </ul>
         
                    <div class="card-footer no-border">
                <a href="#" class="link icon-active">
                  <span class="iconfont icon-daozhequ cardpr"></span>
                  到这去
                </a>
                <a href="${base}ddzfZhong2?productName=${product.name}" class="link icon-active">
                  钟点房
                </a>
                <a href="${base}kfydLone2?productName=${product.name}" class="link icon-active">
                  <span class="iconfont icon-weizhixiangqing cardpr"></span>
                  预订
                </a>
              </div>           
          
                    
                  </div>
                </div>
              </div>
              
            </div>
		</#list>
       
            <#else>
            木有东西哦

</#if>
                   
            <div class="content-padded grid-demo">
              <img src="${base}img/bottom.jpg" width="100%">
              <p><a href="#" class="button button-fill button-light" style="color: #000;">更多</a></p>
            </div>
            <div class="reachtop">
              <div class="reachbtn" external>
                Top
                <span class="icon icon-up"></span>
              </div>
            </div>
            <p class="bq"><font face="Arial">©</font>2017 广州久龙精品酒店 版权所有</p>
            <p class="bq"><a href="${base}javascript:;">电脑版</a></p>
          </div>
        </div>
      </div>
    </div>
    
     <script type='text/javascript' src='${base}js/zepto.min.js'></script>
    <script type='text/javascript' src='${base}js/sm.min.js'></script>
    <script type='text/javascript' src='${base}js/sm-extend.min.js'></script>
    <script type="text/javascript" src="${base}js/sm-city-picker.min.js"></script>
    <script type="text/javascript" src="${base}js/main.js"></script>
    <script type="text/javascript" src="${base}js/convertor.js"></script>
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <script type="text/javascript">
    
      function Location() {};

      Location.prototype.getLocation = function (callback) {
          var options = {
              enableHighAccuracy: true,
              maximumAge: 1000
          };
          this.callback = Object.prototype.toString.call(callback) == "[object Function]" ?
              callback :
          function (address) {
              alert(address.province + address.city);
              console.log("getocation(callbackFunction) 可获得定位信息对象");
          };
          var self = this;
          if (navigator.geolocation) {
              //浏览器支持geolocation
              navigator.geolocation.getCurrentPosition(function (position) {
                  //经度
                  var longitude = position.coords.longitude;
                  //纬度
                  var latitude = position.coords.latitude;
                  self.loadMapApi(longitude, latitude);
              }, self.onError, options);
          } else {
              //浏览器不支持geolocation
          }
      };

      Location.prototype.loadMapApi = function (longitude, latitude) {
          var self = this;
          var oHead = document.getElementsByTagName('HEAD').item(0);
          var oScript = document.createElement("script");
          oScript.type = "text/javascript";
          oScript.src = "http://api.map.baidu.com/getscript?v=2.0&ak=A396783ee700cfdb9ba1df281ce36862&services=&t=20140930184510";
          oHead.appendChild(oScript);
          oScript.onload = function (date) {
              var point = new BMap.Point(longitude, latitude);
              var gc = new BMap.Geocoder();
              gc.getLocation(point, function (rs) {
                  var addComp = rs.addressComponents;
                  self.callback(addComp);
              });
          }
      };

      Location.prototype.onError = function (error) {
          switch (error.code) {
          case 1:
              alert("位置服务被拒绝");
              break;
          case 2:
              alert("暂时获取不到位置信息");
              break;
          case 3:
              alert("获取信息超时");
              break;
          case 4:
              alert("未知错误");
              break;
          }
      };

      //调用
      var local = new Location();
      local.getLocation(function (res) {
          //此处就是返回的地理位置信息
          console.log(res);
          //var resstr = JSON.stringify(res);
          var addressstr=""+res.city+" "+res.district+" "+res.street+"";
          if(addressstr==""){
            document.getElementById('city').value = "位置信息获取失败，请手动选择您的所在位置";
          }
          document.getElementById('city').value = addressstr;
      });
    </script>
  </body>
  
</html>